import React from 'react';
import FlatButton from 'material-ui/FlatButton';
import Dialog from 'material-ui/Dialog';
import TextField from 'material-ui/TextField';
import history from '../history';

export default class StatisticRedirector extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            open: false,
            surveyId: '',
        }

        this.handleClose = this.handleClose.bind(this)
        this.handleOpen = this.handleOpen.bind(this)
        this.handleChange = this.handleChange.bind(this)
        this.handleNavToStatistic = this.handleNavToStatistic.bind(this)
    }

    handleOpen() {
        this.setState({
            open: true
        })
    }

    handleClose() {
        this.setState({
            open: false
        })
    }

    handleChange(e) {
        const val = e.target.value
        this.setState({
            surveyId: val,
        })
    }

    handleNavToStatistic() {
        console.log('Nav to statistic')

        if (!this.state.surveyId) {
            alert('请输入问卷id')
            return
        }

        this.handleClose()

        history.push('/')
        history.push('/statistic/' + this.state.surveyId)
    }

    render() {
        const actions = [
            <FlatButton
                label="Cancel"
                primary={true}
                onClick={this.handleClose}
            />,
            <FlatButton
                label="OK"
                primary={true}
                // keyboardFocused={true}
                onClick={this.handleNavToStatistic}
            />,
        ]

        return (<div>
            <FlatButton style={{color: 'white'}} onClick={this.handleOpen} label="问卷信息统计"/>
            <Dialog
                title='问卷ID'
                actions={actions}
                modal={false}
                open={this.state.open}
                contentStyle={{width: '350px'}}
                onRequestClose={this.handleClose}>

                <TextField
                    value={this.state.surveyId}
                    hintText="问卷ID"
                    name="surveyId"
                    onChange={this.handleChange}
                    floatingLabelText="请输入问卷ID"/>
            </Dialog>
        </div>)
    }
}